@charset "UTF-8";

/* Generales */

@media screen {  
	body {
		color: #FFFFFF;
		background-color: #2B3034;
		font-family: 'Trebuchet MS';
		font-size: 12px;
	}
	
	div.tituloPrincipal{
		font-weight: bold;
		font-size: 30px;
		text-align: center;
	}
	
	div.fondo{
		display: none;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #000;
		z-index: 1001;
		opacity: 0.50;
		-moz-opacity: 0.50;
		/*filter: alpha(opacity=50);*/
	}
	
	div.modal{
		display: none;
		position: absolute;
		top: 10%;
		padding: 16px;
		background: #fff;
		color: #333;
		z-index:9999;
		overflow: auto;
		/* para Firefox */
		-moz-border-radius: 15px;
		/* para Safari y Chrome */
		-webkit-border-radius: 15px;
		/* para Opera */
		border-radius: 15px;
	}
	
	div.error{
		color: red;
	}
	
	div.user{
		position:fixed !important;
		right:0px;
		top:0px;
		z-index:10 !important;
		background-color: rgba(230, 230, 230, 0.2);
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		padding-left: 10px;
		padding-right: 10px;
		-moz-box-shadow: 5px 5px 5px #000000;
		-webkit-box-shadow: 5px 5px 5px #000000;
		box-shadow: 5px 5px 5px #000000;
	}
	
	.tituloVentana{
		font-weight: bold;
		font-size: 14px;
		padding: 0px 5px 0px 5px;
		background-color: rgba(0,0,0,0);
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		text-decoration:none;
	
		-moz-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 4px;
		-webkit-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 4px;
		box-shadow: rgba(255,255,255,.8) 0px 1px 1px, inset rgba(255,255,255,.3) 0 1px 4px;
		
		background-image: -moz-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.1)), color-stop(30%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,.2)));
		background-image: -webkit-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: -o-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: linear-gradient(rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		
		-moz-background-clip: padding-box;
		-webkit-background-clip: padding-box;
		background-clip: padding-box;
		text-decoration:none;
	}
	
	.boton {
		color: white;
		padding: 4px 8px;
		border-style: none;
		background-color: rgba(0,0,0,0);
		font: 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-weight: bolder;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		border-radius: 8px;
		text-decoration:none;
	}
	.boton:hover {
		-moz-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 4px;
		-webkit-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 4px;
		box-shadow: rgba(255,255,255,.8) 0px 1px 1px, inset rgba(255,255,255,.3) 0 1px 4px;
		
		background-image: -moz-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.1)), color-stop(30%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,.2)));
		background-image: -webkit-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: -o-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: linear-gradient(rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		
		-moz-background-clip: padding-box;
		-webkit-background-clip: padding-box;
		background-clip: padding-box;
		text-decoration:none;
	}
	.boton:active {
		background: rgba(255,220,0,.9);
		
		-moz-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		-webkit-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		text-decoration:none;
	}
	.boton:disabled {
		background: rgba(255,220,0,.9);
		
		-moz-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		-webkit-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		text-decoration:none;
	}
}

/*Para moviles exclusivamente o pantallas no mas grandes que 600px*/

@media screen and (max-width:600px){  
	div.modal{
		display: none;
		position: absolute;
		top: 10%;
		padding: 8px;
		background: #fff;
		color: #333;
		z-index:9999;
		overflow: auto;
		/* para Firefox */
		-moz-border-radius: 10px;
		/* para Safari y Chrome */
		-webkit-border-radius: 10px;
		/* para Opera */
		border-radius: 10px;
	}

	.boton {
		color: white;
		padding: 2px 4px;
		border-style: none;
		background-color: rgba(0,0,0,0);
		font: 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-weight: bolder;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		border-radius: 4px;
		text-decoration:none;
	}
	.boton:hover {
		-moz-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 4px;
		-webkit-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 4px;
		box-shadow: rgba(255,255,255,.8) 0px 1px 1px, inset rgba(255,255,255,.3) 0 1px 4px;
		
		background-image: -moz-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.1)), color-stop(30%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,.2)));
		background-image: -webkit-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: -o-linear-gradient(top, rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		background-image: linear-gradient(rgba(0,0,0,.1) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.2) 100%);
		
		-moz-background-clip: padding-box;
		-webkit-background-clip: padding-box;
		background-clip: padding-box;
		text-decoration:none;
	}
	.boton:active {
		background: rgba(255,220,0,.9);
		
		-moz-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		-webkit-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		text-decoration:none;
	}
	.boton:disabled {
		background: rgba(255,220,0,.9);
		
		-moz-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		-webkit-box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		box-shadow: rgba(255,255,255,.28) 0px 1px 1px, inset rgba(0,0,0,.5) 0 1px 6px;
		text-decoration:none;
	}
	
	div.tituloPrincipal{
		font-weight: bold;
		font-size: 30px;
		text-align: left;
	}
	
}
